<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel = "Shortcut Icon" href="static/favicon.ico">
    <link rel="stylesheet" href="static/normalize.css">
    <link rel="stylesheet" href="static/css/mF_fancy.css">
    <!--<link rel="stylesheet" href="static/css/jquery.fullpage.css">-->
    <link rel="stylesheet" href="static/css/animate.min.css">
    <style>
      body {
        font-family: 微软雅黑, Tahoma, Geneva, sans-serif, 宋体;
        font-size: 14px;
        color: #000;
        font-weight: normal;
        height: 100%;
      }
      * {
        padding: 0;
        margin: 0;
      }
      ul,
      ol {
        list-style-type: none;
        outline: none;
      }
      a {
        text-decoration: none;
        color: #fff;
      }
      /*logo旋转制作=====================================================*/
      .logo{float:left;width:200px;height:200px;margin-top:100px;margin-left:50px;position:relative;background-size:cover!important;background:url("/static/img/logo.png") no-repeat center center;}
      .load{position:relative;left:50%;margin-left:-100px;top:50%;margin-top:-150px}
      .hoop1{position: absolute; width: 230px; height: 230px; border: 2px solid rgba(0,0,0,0); border-right: 3px solid #fff; left: -15px; top: -15px; border-radius: 50%; -webkit-animation: myrotate 2s forwards infinite linear; }
      .hoop2{position: absolute; width: 260px; height: 260px; border: 2px solid rgba(0,0,0,0); border-top: 2px solid #24a9e1; left: -30px; top: -30px; border-radius: 50%; -webkit-animation: myrotate 1.5s forwards infinite linear; }
      .hoop3{position: absolute; width: 300px; height: 300px; border: 2px solid rgba(0,0,0,0); border-right: 2px solid yellow; left: -50px; top: -50px; border-radius: 50%; -webkit-animation: myrotate 4s forwards infinite linear; }
      @keyframes myrotate {100% {transform:rotate(360deg); } }
      @-webkit-keyframes myrotate {100% {-webkit-transform:rotate(360deg); } }
    </style>
    <title>weilylab</title>
  </head>
  <body>
  <!--启动loading-->
  <div id="loading" style="background-color: #fff;z-index: 999;position: absolute;width: 100vw;height: 100vh; ">
    <!-- <img src="picture/loading.gif.lnk" style="display: block;margin: 0 auto;position: relative;top: 50%;margin-top: -130px;"> -->
    <div class="logo load">
      <div class="hoop1" style="border-right: 3px solid #333;"></div>
      <div class="hoop2"></div>
      <div class="hoop3"></div>
    </div>
  </div>
  <!--vue根元素-->
  <div id="app"></div>
    <!-- built files will be auto injected -->
  <script src="/static/js/jquery.js"></script>
  <script src="/static/js/jquery.flipping_text.js"></script>
  <script src="/static/js/myfocus-2.0.1.min.js"></script>
  <script src="static/js/mF_fancy.js"></script>
  <!--<script src="static/js/jquery.fullpage.min.js"></script>-->
  <script>
    window.onload = function () {
      let loading = document.getElementById('loading')
      loading.style.display = 'none'//让启动loading消失
      //flipping_text文字打印
      $(".banner2").click(function(){
        $(".intro").flipping_text({
          tickerTime: 2,
          customRandomChar: false,
          tickerCount: 10,
          opacityEffect: true,
          resetOnChange: false
        })
      })
      $(".intro").flipping_text({
        tickerTime: 2,
        customRandomChar: false,
        tickerCount: 10,
        opacityEffect: true,
        resetOnChange: false
      })

      // 荣誉墙滚动
      function solidTop(){
        $(".honour-wall").animate({
          marginTop:-30+"px"
        },1000,function(){
          $(".honour-wall>a").eq(0).appendTo($(".honour-wall"));
          $(".honour-wall").css("marginTop",0+"px");
        });
      }
      var Timer=setInterval(function(){
        solidTop();
      },2500)
      $(".honour-wall").hover(function(){
        clearInterval(Timer);
      },function(){
        Timer=setInterval(function(){
          solidTop();
        },2500)
      })
      close();
      //document.ready

      myFocus.set({//myfocus调用//web.vue中的轮播
        id:"boxID"
      })

    }
  </script>
  </body>
</html>
